ลาก่อน align
XHTML ยกเลิก property align ไปแล้วครับ ถึงแม้ว่า Browser บางตัวอาจจะยังรู้จักอยู่ มาเรียนรู้การใช้ CSS เพื่อจัดตำแหน่งกันครับ
float พระเอกของเราครับ property นี้จะมีผลกับ object เจ้าของโดยเทียบกับภายนอกครับ เป็นการจัดตัวเองจากภายนอก มี value ที่สำคัญคือ left right และ none ครับ โดยที่ถ้าเราต้องการจัดให้อยู่ตรงกลางเราจะใช้ value none และต้องกำหนด margin เป็น 0 auto ด้วยครับ
text-align เป็นการกำหนดตำแหน่งของข้อความภายใน object ทีกำหนดครับ ต่างจาก float นะครับ value ทั่วๆไปก็มี left right center ครับ
CSS ที่ต้องกำหนดครับ
[ex]
float พระเอกของเราครับ property นี้จะมีผลกับ object เจ้าของโดยเทียบกับภายนอกครับ เป็นการจัดตัวเองจากภายนอก มี value ที่สำคัญคือ left right และ none ครับ โดยที่ถ้าเราต้องการจัดให้อยู่ตรงกลางเราจะใช้ value none และต้องกำหนด margin เป็น 0 auto ด้วยครับ
text-align เป็นการกำหนดตำแหน่งของข้อความภายใน object ทีกำหนดครับ ต่างจาก float นะครับ value ทั่วๆไปก็มี left right center ครับ
#center {
float:none;
margin:0 auto;
border:1px solid red;
width:200px;
height:100px;
text-align:center;
}
#left {
float:left;
border:1px solid green;
width:100px;
height:100px;
text-align:left;
}
#right {
float:right;
border:1px solid blue;
width:100px;
height:100px;
text-align:right;
}
CSS ที่ต้องกำหนดครับ
<div id="left">
#left {
float:left;
}
</div>
<div id="right">
#right {
float:right;
}
</div>
<div id="center">
#center {
float:none;
margin:0 auto;
}
</div>
[ex]
#left
#right
#center
[/ex]